@import 'base.less';
@import 'common.less';
body{
	margin: 0 auto !important;
	background: #fff !important;
}

.mui-poppicker{
	button{
		border: none;
	}
	input{
		color: black;
	}
}


// 手机端pt均已改成px

// pc
@media screen and (min-width: 769px) {
	footer{
		width: 1280px;
	}
	.alert,.alert-error{
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		margin: auto;
		height: 100%;
		width: 100%;
		background: rgba(0, 0, 0, 0.5);
		.alert-body{
			position: absolute;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			margin: auto;
			background: #fff;
			height: 4.16rem;
			width: 5.7rem;
			
			h6{
				font-weight: bold;
				margin-bottom: 0;
				margin-top: 0;
				background: #265f73;
				color: #fff;
				height: 0.84rem;
				line-height: 0.84rem;
				text-align: center;
				font-size: 0.36rem;
			}
			p{
				margin: 0 auto;
				padding-top: 0.1rem;
				text-align: center;
				color: #265f73;
				font-size: 0.36rem;
			}
			img{
				margin-top: 20pt;
				margin-left: 100pt;
				width: 0.42rem;
				height: 0.42rem;
			}
			button{
				border-radius: 0;
				margin-top: 0.44rem;
				cursor: pointer;
				margin-left: 54pt;
				color: #fff;
				height: 0.76rem;
				border: none;
				width: 2.86rem;
				background: #265f73;
				font-size: 0.36rem;
			}
		}
	}
	.record-body,.score-body{
		table{
			overflow-y: hidden;
			width: 8.84rem;
			margin: 0 auto;
			tr:first-child{
				// height: 0.88rem;
				margin: auto;
				border-bottom: none;
				th{
					height: 0.26rem;
					line-height: 0.26rem;
					background: #fff;
					font-size: 0.26rem;
					color: rgb(20,115,145);
				}
				th:nth-child(1),th:nth-child(2){
					border-right: 1px solid #e2e2e0;
				}
			}
			tr{
				width: 100%;
				border-bottom: 1px solid #e2e2e0;
				td{
					text-align: center;
					font-size: 0.24rem;
					height: 1.02rem;
					line-height:1.02rem; 
				}
				
				td:nth-child(1),th:nth-child(1){
					width: 33%;
				}
				td:nth-child(3),th:nth-child(3){
					width: 33%;
				}
				td:nth-child(2),th:nth-child(2){
					width: 33%;
				}
			}
		}
	}
	.icon img{
		vertical-align:middle;
		width: 0.3rem;
		height: 0.3rem;
	}
	body{
		margin: 0 auto !important;
		width: 1280px;
	}
	.mobile,.mui-poppicker,.mui-dtpicker{
		display: none !important;
	}
	header{
		background: url(../img/profile_bg_pc.jpg) no-repeat center;
		background-size: cover;
		padding: 10pt 0;
	}
	.show-body table{
		margin-top: 0.3rem;
	}
	.product-body{
		margin: 0 auto;
		width: 8.81rem;
		table{
			width: 8.81rem;
			margin-bottom: 0.31rem;
		}
		tr:first-child{
			border-bottom: none;
		}
		tr{
			margin-left: 0.2rem;
			width:  8.81rem;
			border-bottom: 1px solid #e2e2e0 ;
			td{
				font-size: 0.24rem;
				height: 1.02rem;
				line-height:1.02rem; 
				text-align: center;
			}

			td:nth-child(5){
				img{
					height: 0.32rem;
					vertical-align: middle;;
				}
			}
			th{
				height: 0.26rem;
				line-height: 0.26rem;
				background: #fff;
				font-size: 0.26rem;
				color: rgb(20,115,145);
			}
			th:nth-child(2),th:nth-child(3),th:nth-child(4){
				border-right: 1px solid #e2e2e0;
			}
			td:nth-child(2),th:nth-child(2){
				// .box-flex(1);
				width: 20%;
				// width: 49pt;
			}
			td:nth-child(1),th:nth-child(1){
				// width: 30pt;
				// .box-flex(1);
				width: 8%;
			}
			td:nth-child(4),th:nth-child(4){
				// width: 52pt;
				width: 20%;
				// .box-flex(1);
			}
			td:nth-child(5),th:nth-child(5){
				// width: 35pt;
				width: 20%;
				// .box-flex(1);
			}
			td:nth-child(3),th:nth-child(3){
				// .box-flex(1);
				width: 20%;
			}
		}
		tr:nth-child(2){
			// padding-top: 0.3rem !important;
			// background: red;
		}
	}
	.header-body{
		display: none;
	}
	.header-footer{
		display: none;
	}
	.tab{
		display: block;
		height: 1.58rem;
		margin: 0 auto;
		width: 8.81rem;
		div:first-child{
			margin-left: 0.5rem;
		}
		div{
			margin-right: 0.3rem;
		}
		div{
			width: 1.72rem;
			height: 1.58rem;
			float: left;
			font-size: 0.28rem;
			img{
				padding-top: 10pt;
				padding-left: 18pt;
				display: block;
				margin-bottom: 3pt;
				width: 56px;
			}
			span{
				padding-left: 11pt;
			}
		}
	}
	form{
		font-size: 0.26rem;
		width: 8.81rem;
		margin: 0 auto;
		p{
			font-size: 0.26rem;
			margin-bottom: 0; 
			padding-top: 25pt;
			padding-bottom: 17pt;
		}
		input,select{
			font-size: 0.26rem;
			padding-bottom: 13pt;
		}
		.form-body div{
			margin-right: 10pt;
		}
		input.name{
			width: 5.6rem;
		}

		input.full{
			width: 8.6rem;
		}
		select.three{
			width: 2.4rem;
		}
		select.sex{
			width: 2rem;
		}
		select{
			padding-right: 14px;
			appearance:none;
			-moz-appearance:none;
			-webkit-appearance:none;
			background: url(../img/icon_down.png) no-repeat scroll right center transparent;
		}

		select::-ms-expand{
			display: none;
		}
		img{
			margin-top: 4pt;
			margin-right: 2pt;
			height: 6pt;
			width: 14pt;
		}
	}
	.button-body{
		width: 8.81rem;
		margin: 1.06rem auto;
		button{
			float: left;
			width: 2.93rem;
			font-size: 0.34rem;
			height: 0.7rem;
			margin-bottom: 2rem;
		}
		button:first-child{
			margin-left: 1.5rem;
			margin-right: 0.3rem;
		}
	}
	header .table-footer{
		margin: 0 auto;

		tr{
			padding-left: 10pt;
		}
		th{
			font-size: 0.27rem;
			background: -webkit-linear-gradient(left,rgb(38, 84, 112), rgb(54, 113, 123));
			width: 8.8rem;
			height: 0.78rem;

			.btn-border{
				margin-left: 10pt;
				color: #fff;
				margin: 0 auto;
				border: 1px solid rgba(255, 255, 255,0.2);
				float: left;
				line-height: 0.52rem;
				height: 0.52rem;
				width: 4.13rem;
				img{
					float: left;
					width: 0.46rem;
					height: 0.46rem;
					margin: 0.03rem 0.1rem;
				}
				span{
					font-weight: normal;
					font-size: 0.27rem;
					float: left;
					height: 0.52rem;
					line-height: 0.52rem;
				}
				span:nth-child(3){
					margin: 0 10pt;
				}
			}
			.btn-border:first-child{
				margin-left: 0.14rem;
				margin-right: 0.22rem;
			}
		}
	}
	header .table-header{
		width: 8.81rem;
		margin: 0 auto;
		margin-bottom: 4pt;
		.card-body{
			width: 3.97rem;
			height: 2.38rem;
		}
		.user{
			// margin-right: 64pt;
		}
		.user img{
			margin: 0 auto;
			padding-bottom: 2pt;
			width: 1.7rem;
		}
		.user{
			float: left;
			margin-left: 8px;
   	 		margin-right: 105px;
			img{
				display: block;
			}
			span{
				text-align: center;
				font-size: 0.26rem;
				display: block;
				color: rgba(255, 255, 255, 0.8);
				padding-bottom: 3pt;
			}
			p{
				display: block;
				text-align: center;
				font-size: 0.18rem;
				height: 0.18rem;
				line-height: 0.18rem;
				color: rgba(255, 255, 255, 0.6);
			}
		}
		.card{
			.card-body{
				border-radius: 4pt;
				background: rgb(155, 160, 171);
			}
		}
	}
	.header-body{
		.user{
			span{
				color: #fff;
			}
		}
		.card{
			.card-body{
				border-radius: 4pt;
				background: rgb(155, 160, 171);
			}
		}
	}
	.info-body{
		background: #fff;
		padding-top: 0.3rem;
		.tab {
			background: rgb(189, 190, 191);
			div{
				span{
					color: #fff;
				}
			}
		}
	}
	form{
		.one{
			display: block;
			p{
				color: black;
			}

			.form-body{
				display: block;
				.border-bottom-1px{
					.border-bottom-1px(#eaebef);
					padding-bottom:13pt;
					display: inline;
				}

				p{
					display: block;
					text-align: start;
				}
				i{
					color: red;
					margin-right: 2pt;
					font-size: 0.24rem;
				}
				input,select{
					border: none;
				}
				}
			}
	}
	.button-body{
		button{
			border: none;
			background: rgb(189, 190, 191);
			color: #fff;
		}
		button:first-child{
			background: rgb(39, 94, 116);
		}
	}
}

// mobile
@media screen and (max-width: 768px) {
	footer{
		width: 100%;
	}
	.alert,.alert-error{
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		margin: auto;
		height: 100%;
		width: 100%;
		background: rgba(0, 0, 0, 0.5);
		.alert-body{
			position: absolute;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			margin: auto;
			background: #fff;
			height: 3.8rem;
			width: 4.72rem;
			.display-box();
			.box-orient(vertical);
			.box-align();
			h6{
				margin-top: 0;
				margin-bottom: 0.5rem;
				width: 100%;
				background: #265f73;
				color: #fff;
				height: 0.66rem;
				line-height: 0.66rem;
				text-align: center;
				font-size: 0.3rem;
			}
			p{
				padding-top: 0.1rem;
				padding-bottom: 0.2rem;
				margin: 0 auto;
				text-align: center;
				color: #265f73;
				font-size: 0.3rem;
			}
			div{
				width: 0.42rem;
				height: 0.42rem;
			}
			img{
				width: 0.42rem;
				height: 0.42rem;
			}
			button{
				cursor: pointer;
				margin: 0 auto;
				border-radius: 0;
				line-height: 0;
				color: #fff;
				height: 0.6rem;
				border: none;
				width: 2.28rem;
				background: #265f73;
				font-size: 0.3rem;
			}
		}
	}
	.table-header,.table-footer{
		display: none;
	}
	.pc{
		display: none !important;
	}
	.product-body{
		tr:nth-child(odd){
			background: #fff;
		}
		table{
			margin-bottom: 0.31rem !important;
		}
		tr{
			text-align: center;
			width: 100%;
			border-bottom: 1px solid #e2e2e0;
			td{
				font-size: 0.24rem;
				height: 1.02rem;
				line-height:1.02rem; 
			}
			td:nth-child(5){
				font-size: 0.14rem !important;
				img{
					margin: 0 auto;
					height: 0.32rem;
					vertical-align: middle;;
				}
			}
			td:nth-child(1) img{
				margin: 0 auto;
			}
			th{
				height: 0.26rem;
				line-height: 0.26rem;
				background: #fff;
				font-size: 0.26rem;
				color: rgb(20,115,145);
				margin: 0.3rem 0;
			}
			th:nth-child(2),th:nth-child(3),th:nth-child(4){
				border-right: 1px solid #e2e2e0;
			}
			td:nth-child(2),th:nth-child(2){
				width: 21vw;
			}
			td:nth-child(1),th:nth-child(1){
				width: 8vw;
			}
			td:nth-child(4),th:nth-child(4){
				width: 18vw;
			}
			td:nth-child(5),th:nth-child(5){
				width: 20vw;
			}
			td:nth-child(3),th:nth-child(3){
				width: 33vw;
			}
		}
	}
	table{
		margin-bottom: 2rem;
	}
	.score-body{
		tr:nth-child(odd){
			background: #fff;
		}
		
		tr{
			text-align: center;
			width: 100%;
			border-bottom: 1px solid #e2e2e0;
			td{
				font-size: 0.24rem;
				height: 1.02rem;
				line-height:1.02rem; 
			}
			th{
				height: 0.26rem;
				line-height: 0.26rem;
				background: #fff;
				font-size: 0.26rem;
				color: rgb(20,115,145);
				margin: 0.3rem 0;
			}
			th:nth-child(1),th:nth-child(2){
				border-right: 1px solid #e2e2e0;
			}
			td:nth-child(1),th:nth-child(1){
				width: 33vw;
			}
			td:nth-child(3),th:nth-child(3){
				width: 33vw;
			}
			td:nth-child(2),th:nth-child(2){
				width: 33vw;
			}
		}
	}
	.record-body{
		tr:nth-child(odd){
			background: #fff;
		}
		
		tr{
			text-align: center;
			width: 100%;
			border-bottom: 1px solid #e2e2e0;
			td{
				font-size: 0.24rem;
				height: 1.02rem;
				line-height:1.02rem; 
			}
			th{
				height: 0.26rem;
				line-height: 0.26rem;
				background: #fff;
				font-size: 0.26rem;
				color: rgb(20,115,145);
				margin: 0.3rem 0;
			}
			th:nth-child(1),th:nth-child(2){
				border-right: 1px solid #e2e2e0;
			}
			td:nth-child(1),th:nth-child(1){
				width: 33vw;
			}
			td:nth-child(3),th:nth-child(3){
				width: 33vw;
			}
			td:nth-child(2),th:nth-child(2){
				width: 33vw;
			}
		}
	}
	table{
		overflow-y: hidden;
		.display-box();
		width: 100%;
		tbody{
			.display-box();
			.box-orient(vertical);
			.box-flex(1);
		}
		.icon{
			.display-box();
			.box-align();
			img{
				.display-box();
				width: 0.32rem;
				height: 0.32rem;
			}
		}
		tr{
			.display-box();
			margin: 0 auto;
			th{
				.display-box();
				.box-pack();
				color: rgba(245, 247, 248,0.7);
				background: rgb(160, 178, 186);
			}
			td{
				.display-box();
				.box-pack();
				.box-align();
			}
		}
		tr:nth-child(even){
			background: #fff;
		}
		tr:nth-child(odd){
			background: rgb(241,242,244);
		}
	}
	header{
		background: url(../img/profile_bg.jpg) no-repeat center;
		background-size: cover;
		padding: 0.32rem 0;
	}
	.header-body{
		width: 82%;
		margin: 0 auto;
		.display-box();
		.user{
			.box-flex(1);
		}
		.card-body{
			width: 3.01rem;
			height: 1.82rem;
		}

		.user img{
			margin-bottom: 0.13rem;
			width: 1.27rem;
			height: 1.27rem;
		}
		.user span{
			color: rgba(255, 255, 255, 0.8);
			font-size: 0.26rem;
			line-height: 0.26rem;
			height: 0.26rem;
			margin-bottom: 0.1rem;
		}
		p{
			height: 0.24rem;
			line-height: 0.24rem;
			font-size: 0.24rem;
			color: rgba(255, 255, 255, 0.6);
		}
	}
	.header-footer{
		.display-box();
		font-size: 0.22rem;
		background: -webkit-linear-gradient(left,rgb(38, 84, 112), rgb(54, 113, 123));
		width: 87%;
		padding: 0 0.16rem;
		height: 0.59rem;
		.btn-border{
			.box-flex();
			height: 0.4rem;
			padding: 0 0.08rem;
			img{
				.display-box();
				width: 0.34rem;
				height: 0.34rem;
				margin-right: 0.05rem;
			}
		}
		.btn-border:first-child{
			margin-right: 0.24rem;
		}
	}
	.tab{
		height: 1.58rem;
		margin: 0 auto;
		padding: 0 0.22rem;
		div{
			font-size: 0.28rem;
			img{
				margin-bottom: 0.08rem;
				width: 0.74rem;
			}
		}
	}
	form{
		font-size: 0.3rem;
		margin: 0 0.3rem;
		p{
			margin-bottom: 0;
			padding-top: 0.61rem;
			padding-bottom: 0.4rem;
		}
		input,select{
			font-size: 0.3rem;
			padding-bottom: 0.32rem;
		}
		select{
			padding: 0;
			margin-bottom: 0;
			padding-bottom: 0.32rem;
		}
		.form-body div{
			margin-right: 0.24rem;
		}
		img{
			margin-top: 0.1rem;
			margin-right: 0.05rem;
			height: 0.27rem;
			width: 0.27rem;
		}
	}
	.button-body{
		margin: 0.66rem 0.3rem 1.5rem 0.3rem;
		button{
			width: 2rem;
			font-size: 0.34rem;
			height: 0.7rem;
		}
		button:first-child{
			margin-right: 0.3rem;
		}
	}
	.header-body{
		.display-box();
		.box-pack();
		.user{
			.display-box();
			.box-orient(vertical);
			img{
				.display-box();
				margin-left: 0.36rem;
			}
			span,p{
				.display-box();
			}
		}
		.card{
			.display-box();
			.card-body{
				border-radius: 0.1rem;
				background: rgb(155, 160, 171);
			}
		}
	}
	.header-footer{
		.display-box();
		.box-orient(horizontal);
		.box-align();
		color: #fff;
		margin: 0 auto;
		.btn-border{
			.display-box();
			.box-align();
			.box-pack(start);
			border: 1px solid rgba(255, 255, 255,0.2);
			span{
				.display-box();
				height: 0.24rem;
    			line-height: 0.24rem;
			}
			span:nth-child(3){
				padding: 0 0.2rem;
			}
			img{
				.display-box();
				.box-align();
			}
		}
			
	}
	.info-body{
		background: #fff;
		.tab {
			background: rgb(189, 190, 191);
			.display-box();
			div{
				.display-box();
				.box-flex();
				.box-align();
				.box-pack();
				.box-orient(vertical);
				img{
					.display-box();
				}	
				span{
					.display-box();
					color: black;
				}
			}
		}
	}

	form{
		.one{
			.display-box();
			.box-orient(vertical);
			p{
				.display-box();
				color: black;
			}
			.form-body{
				.display-box();
				div{
					.display-box();
					.box-flex(1);
					.border-bottom-1px(#eaebef) ;
				}
				div:last-child{
					margin-right: 0;
				}
				i{
					.display-box();
					color: red;
					margin-right: 2pt;
					font-size: 0.24rem;
				}
				input,select{
					background: #fff;
					.display-box();
					.box-flex(1);
					border: none;
				}
				img{
					.display-box();
					.box-align();
				}
			}
		}
		.one:nth-child(2){
			.border-bottom-1px:nth-child(2){
				width: 1.78rem;
			}
		}
	}


	.button-body{
		.display-box();
		.box-align();
		.box-pack();
		button{
			.display-box();
			border: none;
			.box-flex();
			background: rgb(189, 190, 191);
			color: #fff;
		}
		button:first-child{
			background: rgb(39, 94, 116);
		}
	}
	.product-body{
		table{
			margin-bottom: 0;
			tbody{
				padding-bottom:0;
			}
		}
	}
}



footer{
	position: fixed;
	bottom: 0;
	cursor: pointer;
	line-height: 0.86rem;
	text-align: center;
	height: 0.86rem;
	color: rgb(114, 113, 113);
	font-size: 0.3rem;
	background: rgb(234, 235, 239);
}



.product-body a{
	color: #2199d6;
	height: 0.28rem;
	line-height: 0.28rem;
	font-size: 0.22rem;
	margin-left: 0.26rem;
}

div.select{
	background: url(../img/tab_click.png);
	span{
		color: #fff !important;
	}
}
.tab{
	cursor: pointer;
}
.hide{
	display: none !important;
}


.disable-click{
	td{
		color: #e2e2e0;
	
	}
	
}

